(function() {
	
	//第一件事
	$.ajax({
		url: 'data/film_list.json',
		dataType: 'json',
		success(data) {
			//------------热映----------------------------
			const hot = data.slice(0, 8);
			$('.hot-num').html(`正在热映（${hot.length}部）`);
			let f = ``;
			hot.forEach(function(val) {
				f += getFilm(val);
			});
			$('.hot').empty();
			$('.hot').append(f);
			//------------科幻----------------------------
			/* let arr = [];
			data.forEach(function(val) {
				let categoryList = val.category_list;
				categoryList.forEach(function(c) {
					if (c.category_id == 1007) {
						arr.push(val);
					}
				})
			}); */
			let arr2 = data.filter(function(val) {
				return val.category_list.find(function(c) {
					return c.category_id == 1007;
				});
			});
			arr2 = arr2.slice(0, 8);
			$('.science-num').html(`科幻大片（${arr2.length}部）`);
			let f2 = ``;
			arr2.forEach(function(val) {
				f2 += getFilm(val);
			});
			$('.science').empty();
			$('.science').append(f2);
			//------------动画----------------------------
			let arr3 = data.filter(function(val) {
				return val.category_list.find(function(c) {
					return c.category_id == 1003;
				});
			});
			arr3 = arr3.slice(0, 8);
			$('.animation-num').html(`奇趣动画（${arr3.length}部）`);
			let f3 = ``;
			arr3.forEach(function(val) {
				f3 += getFilm(val);
			});
			$('.animation').empty();
			$('.animation').append(f3);

			//绑定事件(每一部影片)
			$('.film-click').click(function(e) {
				e.preventDefault()
				let filmId = $(this).children('input').val();
				//存储filmId
				localStorage.setItem("filmId", filmId);
				//跳转
				location.href = '影片详情.html';
			})
			//-----------今日票房----------------------------
			const today = data.slice(0, 8);
			let div = ``;
			today.forEach(function(val, index) {
				if (index == 0) {
					div += `<div class="my-2 shadow-hover rounded p-3 hand d-flex justify-between align-items-center">
								<div class="film-ranking-image w-50 rounded"><img src="./img/${val.film_cover_image}" class="w-100">
								</div>
								<div class="w-50 pl-3">
									<div class="text-gray mb-2">${val.film_name}</div>
									<div class="text-red text-sm text-bold mt-2">${val.film_box}万</div>
								</div>
							</div>`;
				} else {
					div += `<div class="my-1 shadow-hover rounded py-1 px-2 hand d-flex justify-between align-items-center">
									<div class="text-big text-red text-bold mr-2">${index + 1}</div>
									<div class="mr-auto text-gray">${val.film_name}</div>
									<div class="text-sm text-red text-bold">${val.film_box}万 </div>
								</div>`;
				}
			});
			// $('.today').empty();
			$('.today').append(div);
		}
	})
	
	//第二件事
	
})()
